import React, { useState, useEffect } from 'react'
import img1 from './imgs/10.jpg'
import img2 from './imgs/11.png'
import img3 from './imgs/项目1.png'
import img4 from './imgs/项目2.png'
import img5 from './imgs/项目3.png'
import img6 from './imgs/项目4.png'
import './shou.css';
import { List, Switch } from 'antd-mobile'
import {
  FileOutline,
  FileWrongOutline,
  CollectMoneyOutline,
  TextOutline

} from 'antd-mobile-icons'
import {useNavigate} from 'react-router-dom'

export default function Shou() {
  const [list, setList] = useState(() => {
    let array = localStorage.getItem('user')
    return array ? JSON.parse(array) : []
  })
  console.log(list);
  
  const navigate=useNavigate()
  return (
    <div className='div'>
      <div className="box">
      </div>
      <div>
        {
          list.map(item => {
            return (
              <div key={item._id} className="user-box">
                <img src={item.imgs} className="user-img"></img>
                <div>
                  <div>
                    <p className='user-p1'>{item.username}</p>
                    <p className="user-p">{item.bumen}</p>
                  </div>
                  <div className="user-role">
                    <button className="role-btn">
                      <p className="role-jl">{item.zhiye}</p>
                      <p className="role-m">Managere</p>
                    </button>
                  </div>
                </div>
                <img src={img2} className='user-img1'></img>
              </div>
            )
          })
        }
      </div>
      <div className="list">
        <List>
          <List.Item prefix={<FileOutline />} extra={8} onClick={() => { navigate('/daiban') }}>
            我的待办
          </List.Item>
          <List.Item prefix={<FileWrongOutline />} extra={8}  onClick={() => {navigate('/yiban') }}>
            我的已办
          </List.Item>
          <List.Item prefix={<CollectMoneyOutline />} extra={8} onClick={() => { }}>
            我的申请
          </List.Item>
          <List.Item prefix={<TextOutline />} extra={8} onClick={() => { }}>
            暂存申请
          </List.Item>
        </List>
      </div>
      <div className="box-box">
        <div className="box-div" onClick={()=>{navigate("/chuchai"),localStorage.setItem("dizhi","/chuchai")}}>
          <img src={img3} className="box-img"></img>
          <h4>出差申报</h4>
        </div>
        <div className="box-div" onClick={()=>{navigate("/qingjia")}}>
          <img src={img4} className="box-img"></img>
          <h4>请假申报</h4>
        </div>
        <div className="box-div" onClick={()=>{navigate("/waiqin"),localStorage.setItem("dizhi","/waiqin")}}>
          <img src={img5} className="box-img"></img>
          <h4>外勤申报</h4>
        </div>
        <div className="box-div" onClick={()=>{navigate("/attendance")}}>
          <img src={img6} className="box-img"></img>
          <h4>考勤统计</h4>
        </div>
      </div>
    </div>
  )
}
